import React, { Component } from 'react'
import { Route, Switch } from 'react-router-dom/cjs/react-router-dom.min'
import NowPlaying from './films/NowPlaying'
import ComingSoon from './films/ComingSoon'
import { NavLink } from 'react-router-dom/cjs/react-router-dom.min'
import style from './css/Film.module.css'

export default class Films extends Component {
    render() {
        return (
            <div>
                <div style={{ height: '200px', backgroundColor: 'yellow' }}>
                    大轮播
                </div>
                <div className={style.film_tabbar}>
                    <ul>
                        <li>
                            <NavLink to="/films/nowPlaying">正在热映</NavLink>
                        </li>
                        <li>
                            <NavLink to="/films/comingSoon">即将上映</NavLink>
                        </li>
                    </ul>
                </div>

                <Switch>
                    <Route path="/films/nowPlaying" component={NowPlaying} />
                    <Route path="/films/comingSoon" component={ComingSoon} />
                    {/* <Redirect from="/films" to="/films/nowPlaying" /> */}
                </Switch>
            </div>
        )
    }
}
